<!DOCTYPE html>
<html>

	<head>
		<meta charset="utf-8">
		<title>冲印</title>
		<meta name="viewport" content="width=device-width, initial-scale=1,maximum-scale=1,user-scalable=no">
		<meta name="apple-mobile-web-app-capable" content="yes">
		<meta name="apple-mobile-web-app-status-bar-style" content="black">
		<link rel="stylesheet" href="../css.min/mui.min.css">
		<link rel="stylesheet" href="../css/iconfont.css" />
		<link rel="stylesheet" href="../css/common.css" />
		<style>
			.mui-grid-view.mui-grid-9:after, .mui-grid-view.mui-grid-9:before{display: none;}
			.mui-table-view .mui-table-view-cell,.mui-media-body{color: white !important;}
		</style>
	</head>

	<body>
		<div class="mui-content">
			<div id="slider" class="mui-slider">
				<div class="mui-slider-group mui-slider-loop">
					<!-- 额外增加的一个节点(循环轮播：第一个节点是最后一张轮播) -->
					<div class="mui-slider-item mui-slider-item-duplicate">
						<a href="#">
							<img src="http://7xp9yg.com1.z0.glb.clouddn.com/picture_3.jpg">
							<p class="mui-slider-title">可以根据需求自定义冲印图片尺寸哦</p>
						</a>
					</div>
					<div class="mui-slider-item">
						<a href="#">
							<img src="http://7xp9yg.com1.z0.glb.clouddn.com/picture_1.jpg">
							<p class="mui-slider-title">拿起你的手机，轻松留下年轻时的记忆</p>
						</a>
					</div>
					<div class="mui-slider-item">
						<a href="#">
							<img src="http://7xp9yg.com1.z0.glb.clouddn.com/picture_2.jpg">
							<p class="mui-slider-title">定格生活的美好瞬间，让记忆陪伴你走的更远一点</p>
						</a>
					</div>
					<div class="mui-slider-item">
						<a href="#">
							<img src="http://7xp9yg.com1.z0.glb.clouddn.com/picture_3.jpg">
							<p class="mui-slider-title">可以根据需求自定义冲印图片尺寸哦</p>
						</a>
					</div>
					<!-- 额外增加的一个节点(循环轮播：最后一个节点是第一张轮播) -->
					<div class="mui-slider-item mui-slider-item-duplicate">
						<a href="#">
							<img src="http://7xp9yg.com1.z0.glb.clouddn.com/picture_1.jpg">
							<p class="mui-slider-title">拿起你的手机，轻松留下年轻时的记忆</p>
						</a>
					</div>
				</div>
				<div class="mui-slider-indicator mui-text-right">
					<div class="mui-indicator mui-active"></div>
					<div class="mui-indicator"></div>
					<div class="mui-indicator"></div>					
				</div>
			</div>
			
			<div class="mui-content-padded">
				<ul class="mui-table-view mui-grid-view mui-grid-9" style="background-color: #eb4f38;">
		            <li class="mui-table-view-cell mui-media mui-col-xs-6 mui-col-sm-6"><a id="openprint-page" href="#">
		                    <span class="mui-icon iconfont icon-icon38"></span>
		                    <div class="mui-media-body">立即制作</div></a></li>
		            <li class="mui-table-view-cell mui-media mui-col-xs-6 mui-col-sm-6"><a id="opendescribe-page" href="#">
		                    <span class="mui-icon iconfont icon-chongyingxuzhi"></span>
		                    <div class="mui-media-body">冲印须知</div></a></li>
		        </ul> 
		        
		        <p style="margin-top: 40px;">~体验账户：丰丰，ff123~</p>
		        
			</div>
			
			
			
		</div>
		
		<script src="../js.min/mui.min.js"></script>
		<script type="text/javascript" src="../js/config.js" ></script>
		<script type="text/javascript" src="../js/utils.js" ></script>
		<script>
			mui.init();
			
			mui.plusReady(function() {
				
				var netInfo=utils.getNetInfo();
				var imgObj=Slider.querySelectorAll('img');
				if(netInfo.type==0 || netInfo.type==1){
					for (var i = 0; i < imgObj.length; i++) {
						var obj=imgObj[i];
						obj.src="../img/load.jpg";
					}
					
					Slider.style.display="block";
				}else{//读取缓存
					var imgObjlen=imgObj.length;
					for (var i = 0; i < imgObjlen; i++) {
						var $img = imgObj[i];
						var url = $img.getAttribute("src");
						if (url) {
							mui.loadCacheFile(url, $img, function(data) {
								data.obj.setAttribute("src", data.url);
								
							});
						}
					}
					
					Slider.style.display="block";
					
				}
				
			});
			
			var PrintBtn=null,DescribBtn=null,Slider=null;
			document.addEventListener("DOMContentLoaded",function(){
				
				PrintBtn=document.getElementById("openprint-page");
				DescribBtn=document.getElementById("opendescribe-page");
				Slider=document.getElementById("slider");
				
				PrintBtn.addEventListener('tap', function(event) {
					utils.openWindow('printsetting','printsetting.html','slide-in-right',300,false);
				}, false);
				
				DescribBtn.addEventListener('tap', function(event) {
					utils.openWindow('print_describe','print_describe.html','slide-in-right',300,false);
				}, false);
				
				mui("#slider").slider({
					interval: 3000
				});
				
				Slider.style.display="none";
				
			});
		
		</script>
	</body>
</html>